<template>
	<view class="add page c00">
		<view class="bgf7 p12">
			<view class="bgff px14 pb10">

				<view class="flex flexC borb py12">
					<text class="flex1">券名</text>
					<input type="text" v-model="data.title" disabled="disable" class="py3 aliR" />
				</view>

				<view class="flex flexC borb py12">
					<text class="flex1">抵扣时长</text>
					<input type="digit" v-model="data.hour" disabled="disable" placeholder="抵扣时长" class="py3 aliR" />小时
				</view>

				<view class="flex flexC borb py12">
					<text class="flex1">消费店铺</text>
					<input type="text" v-model="data.shopName" disabled="disable" class="py3 aliR" />
				</view>

				<view class="flex flexS  pb12 pt18" @click="$refs.popup3.open()">
					<text v-if="type == 'qp'" class="mr14 pt3">选择包厢</text>
					<text v-else class="mr14 pt3">选择 包厢/台桌</text>
					
					<view class="flex aliR flexC flexW flex1" style="margin-left: 42%;">
					   {{currentRoom.name}}
					</view>
					<text class="arrowR ml3"></text>
					
				</view>

			</view>
			<view class="flex flexC flexJC py20">
				<view  @click="check" class="aliC py12 w-17 bgf6c r40" >去预定消费</view>
			</view>
			

		</view>
		
		<uni-popup ref="popup3" type="bottom">
			<view class="popup-content2">
		
			
				<view v-for="item in data.roomName" class="popup-btn" @click="selectRoom(item)" >{{item.name}}</view>
		
			</view>
		
		</uni-popup>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				mt_id: '',
				data: null,
				currentRoom:null,
				room_id:'',
				is_room_exists:false,
				is_table_book_mode:1
			};
		},
		
		onLoad(option) {
			if(option.room_id == undefined){
				this.room_id = '';
			}else{
				this.room_id = option.room_id;
			}
			console.log('=======美团券详情界面的包厢ID==========:'+ this.room_id);
			
			this.mt_id = option.id;
			this.getDetail();
		},

		onShow() {

		},
		methods: {
			
			check(){
				let date = new Date();
				let h = date.getHours(); //获取小时
				let m = date.getMinutes(); //获取分钟
				
				var year = date.getFullYear();
				 
				var month = date.getMonth() + 1;
				 
				var day = date.getDate();
				 
				month = (month > 9) ? month : ("0" + month);
				day = (day < 10) ? ("0" + day) : day;
				var today = year + "-" + month + "-" + day;
				
				var startTime= h + ":" + m;
				var obj = new Object();
				obj.shop_id = this.data.shop_id;
				obj.id = this.currentRoom.id;
				obj.hour = this.data.hour;
				obj.startDate = today;
				obj.startTime = startTime;
				obj.couponName = this.data.title;
				obj.mtCode = this.data.code;
				if (this.type == 'tq') {
					this.bookTq(obj);
				} else{
					
					if(this.data.hour == 1){
						
						uni.showToast({
							title:"此券是续时券，只能用于续时",
							icon:'none'
						})
						return;
					}
					uni.navigateTo({
						url:'../order/submit?meituan='+JSON.stringify(obj)
					})
				}
				
				
			},
			
			bookTq(obj){
				// 需要判断店铺是否是:预定模式(2) OR 押金模式(1)
				if(this.is_table_book_mode == 2){
					uni.navigateTo({
						url:'../order/tableSubmit?meituan='+JSON.stringify(obj)
					})
					
				}else{
					let param = {
						id: obj.id,
						mt_code:obj.mtCode
					};
					let that = this;
					this.$api.tableAddOrder(param).then(res => {
						console.info(JSON.stringify(res));
						if (res.code == 1) {
							that.order_no = res.data.order_no;
							uni.redirectTo({
								url: '../order/tableDetail?order_no=' + that.order_no
							})
						} else {
							uni.showToast({
								icon: "none",
								title: res.msg
							})
						}
					
					})
				}
			},
			
			selectRoom(item){
				this.currentRoom= item;
				this.$refs.popup3.close();
			},

			getDetail() {
				let param = {
					id: this.mt_id,
					room_id:this.room_id,
				};
				console.info("===========美团券详情页的参数=========:"+JSON.stringify(param));
				let that = this;
				this.$api.mtUserCodeDetail(param).then(res => {

					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.data = res.data;
						if(res.data.is_room_exists == false && that.room_id != ''){
							uni.showModal({
								showCancel:false,
								title:'提示',
								content:'该券与当前选择包厢不匹配，可以重新选择其他包厢使用',
								complete:function(){
									
								}
							})
						}
						that.type = res.data.type;
						that.currentRoom = res.data.roomName[0];
						that.is_table_book_mode = res.data.is_table_book_mode;
						
					} else {
						uni.showToast({
							title:res.msg,
							icon:"none"
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.add {
		.w48 {
			width: 96rpx;
			height: 96rpx;
		}

		.imgbox {
			width: 164rpx;
			height: 164rpx;
			background-color: #E8E8E8;
			position: relative;

			image {
				width: 100%;
				height: 100%;
			}

			.del {
				width: 36rpx;
				height: 36rpx;
				background: rgba(181, 180, 180, .8);
				position: absolute;
				top: -12rpx;
				right: -12rpx;
			}
		}
	}

	.popup-content2 {
		background: #FFFFFF;

		.popup-btn {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
		}

		.button {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
			font-size: 11pt;
		}

		button::after {
			border: none;
		}

		.pt20 {
			border-bottom: 20rpx solid #f5f5f5;
		}
	}
	
	
</style>